<!--<div>-->
<!--  <div class="searchItem">-->
<!--    <label for="commodity">商品：</label>-->
<!--    <input id="commodity" nz-input placeholder="请输入用户Id" [(ngModel)]="table.query."/>-->
<!--  </div>-->
<!--  <div class="searchItem">-->
<!--    <label>分类：</label>-->
<!--    <nz-select [(ngModel)]="table.query." nzMode="multiple"-->
<!--               [nzMaxTagCount]="1" nzAllowClear nzPlaceHolder="请选择" [nzBackdrop]="true">-->
<!--      <nz-option [nzValue]="0" nzLabel="购买"></nz-option>-->
<!--      <nz-option [nzValue]="1" nzLabel="免费领取"></nz-option>-->
<!--    </nz-select>-->
<!--  </div>-->
<!--  <div class="searchItem">-->
<!--    <label>品牌：</label>-->
<!--    <nz-select [(ngModel)]="table.query." nzMode="multiple"-->
<!--               [nzMaxTagCount]="1" nzAllowClear nzPlaceHolder="请选择" [nzBackdrop]="true">-->
<!--      <nz-option [nzValue]="0" nzLabel="购买"></nz-option>-->
<!--      <nz-option [nzValue]="1" nzLabel="免费领取"></nz-option>-->
<!--    </nz-select>-->
<!--  </div>-->
<!--  <div class="searchItem">-->
<!--    <button nz-button nzType="primary" (click)="queryBtn()">查询</button>-->
<!--    <button nz-button nzType="default" (click)="resetCondition()">重置</button>-->
<!--  </div>-->
<!--</div>-->
<div class="addBtnRow">
  <button nz-button nzType="primary" (click)="showAddCommonCommodityModal()">添加普通商品</button>
  <button nz-button nzType="default" (click)="showUsedCommonCommodityModal()">添加二手商品</button>
</div>
<!--表格-->
<nz-table
  #rowSelectionTable
  nzSize="small"
  nzTableLayout="fixed"
  nzShowSizeChanger
  nzShowQuickJumper
  nzOuterBordered
  [nzData]="table.listData.records"
  [nzPageSizeOptions]="[5, 10, 20, 50, 100]"
  [nzTotal]="table.listData.total"
  [(nzPageIndex)]="table.query.page"
  [(nzPageSize)]="table.query.pageSize"
  [nzFrontPagination]="false"
  [nzShowTotal]="totalTemplate"
  (nzPageIndexChange)="onPageIndexChange($event)"
  (nzPageSizeChange)="onPageSizeChange($event)"
>
  <thead>
  <tr>
    <th nzAlign="center">排序</th>
    <th nzAlign="center">商品编号/机器编码</th>
    <th nzAlign="center">商品类型</th>
    <th nzAlign="center" nzWidth="200px">商品名称/型号</th>
    <th nzAlign="center">商品库存</th>
    <th nzAlign="center">主图</th>
    <th nzAlign="center">商品状态</th>
    <th nzAlign="center">适用用户</th>
    <th nzAlign="center">C端单价</th>
    <th nzAlign="center">是否推荐</th>
    <th nzAlign="center" nzWidth="200px">操作</th>
  </tr>
  </thead>
  <tbody>
  <tr *ngFor="let data of rowSelectionTable.data;let index=index;">
    <td nzAlign="center">{{(table.query.page - 1) * table.query.pageSize + index + 1}}</td>
    <td nzAlign="center">{{data['code']}}</td>
    <td nzAlign="center">{{GOODSTYPE[data['source']]}}</td>
    <td nzAlign="center" [nzEllipsis]="true" [nzTooltipTitle]="data['goodsName']" nzTooltipPlacement="topCenter"
        nz-tooltip>
      <a style="color: #1890ff" *ngIf="data.source===0" href=".#/goods/goodsTabs/{{data.otherGoodsId}}" target="_blank">{{data['goodsName']}}</a>
      <a style="color: #1890ff" *ngIf="data.source===1"
         target="_blank"
         [routerLink]="['/used-store/usedCommodityInfo']"
         [queryParams]="{ id: data.otherGoodsId }">
        {{data['goodsName']}}
      </a>
    </td>
    <td nzAlign="center">{{data['stockNum']}}</td>
    <td nzAlign="center">
      <img
        nz-image
        width="60px"
        height="60px"
        *ngIf="data['img']"
        [nzSrc]="data['img']"
        [alt]="data['name']"
      />
      <span *ngIf="!data['img']">-</span>
    </td>
    <td nzAlign="center" *ngIf="data.source==0">{{COMMODITYSTATUS[data['status']]}}</td>
    <td nzAlign="center" *ngIf="data.source==1">{{USEDSTATUS[data['status']]}}</td>
    <td nzAlign="center">{{USERTYPE[data['userType']]}}</td>
    <td nzAlign="center">{{data['shopPrice']}}</td>
    <td nzAlign="center"
        [attr.statusColor]="data['recommendStatus2']===1?'0':'2'">{{data['recommendStatus2'] === 0 ? '未推荐' : '已推荐'}}</td>
    <td nzAlign="center">
      <a (click)="move(data['id'],1)" *ngIf="((table.query.page - 1) * table.query.pageSize + index + 1)!==1">上移</a>
      <a (click)="move(data['id'],0)" *ngIf="((table.query.page - 1) * table.query.pageSize + index + 1)!==table.listData.total">下移</a>
      <a *ngIf="data['recommendStatus2']===0" [attr.statusColor]="data['recommendStatus2']"
         (click)="changeStatus(data,1)">推荐</a>
      <a *ngIf="data['recommendStatus2']===1" [attr.statusColor]="data['recommendStatus2']"
         (click)="changeStatus(data,0)">取消推荐</a>
      <a nzPopconfirmPlacement="top" [attr.statusColor]="1"
         nz-popconfirm
         nzPopconfirmTitle="确认要删除?"
         nzOkText="确认"
         (nzOnConfirm)="deleteCommodity(data['id'])"
         nzCancelText="取消">删除</a>
    </td>
  </tr>
  </tbody>
</nz-table>
<!-- 分页template -->
<ng-template #totalTemplate let-total>共有 {{ table.listData.total }} 条</ng-template>

<!--添加普通商品-->
<nz-modal
  [(nzVisible)]="addCommonCommodityModal.visible"
  nzTitle="添加普通商品" nzWidth="1200px"
  [nzFooter]="null"
  (nzOnCancel)="hideAddCommonCommodityModal()">
  <div *nzModalContent>
    <div>
      <div class="searchItem">
        <label for="commodity" style="width: 45px">商品：</label>
        <input id="commodity" nz-input placeholder="请输入商品编号/名称"
               [(ngModel)]="addCommonCommodityModal.query.goods"/>
      </div>
      <div class="searchItem">
        <label>分类：</label>
        <nz-tree-select
          nzDefaultExpandAll
          nzShowSearch
          nzCheckable
          nzCheckStrictly
          nzHideUnMatched
          nzPlaceHolder="请选择商品分类"
          nzVirtualHeight="400px"
          [nzMaxTagCount]="1"
          [nzNodes]="addCommonCommodityModal.typeOptions"
          [(ngModel)]="addCommonCommodityModal.query.typeList"
        ></nz-tree-select>
      </div>
      <div class="searchItem">
        <label>品牌：</label>
        <nz-select [(ngModel)]="addCommonCommodityModal.query.brandList" nzMode="multiple"
                   [nzMaxTagCount]="1" nzAllowClear nzPlaceHolder="请选择" [nzBackdrop]="true">
          <nz-option [nzValue]="b['id']" [nzLabel]="b['name']"
                     *ngFor="let b of addCommonCommodityModal.brandOptions"></nz-option>
        </nz-select>
      </div>
      <div class="searchItem">
        <button nz-button nzType="primary" (click)="getCommonCommodity(true)">查询</button>
        <button nz-button nzType="default" (click)="resetCommonCommodityCondition()">重置</button>
      </div>
    </div>
    <!--表格-->
    <nz-table
      #rowSelectionTable
      nzSize="small"
      nzTableLayout="fixed"
      nzShowSizeChanger
      nzShowQuickJumper
      nzOuterBordered
      [nzData]="addCommonCommodityModal.listData.records"
      [nzPageSizeOptions]="[5, 10, 20, 50, 100]"
      [nzTotal]="addCommonCommodityModal.listData.total"
      [(nzPageIndex)]="addCommonCommodityModal.query.page"
      [(nzPageSize)]="addCommonCommodityModal.query.pageSize"
      [nzFrontPagination]="false"
      [nzShowTotal]="totalTemplate"
      (nzPageIndexChange)="onCommonPageIndexChange($event)"
      (nzPageSizeChange)="onCommonPageSizeChange($event)"
    >
      <thead>
      <tr>
        <th nzAlign="center">商品编号</th>
        <th nzAlign="center" nzWidth="300px">商品名称</th>
        <th nzAlign="center">商品分类</th>
        <th nzAlign="center">商品品牌</th>
        <th nzAlign="center">适用用户</th>
        <th nzAlign="center">商品状态</th>
        <th nzAlign="center" nzWidth="160px">操作</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let data of rowSelectionTable.data;let index=index;">
        <td nzAlign="center">{{data['code']}}</td>
        <td nzAlign="center" [nzEllipsis]="true" [nzTooltipTitle]="data['name']" nzTooltipPlacement="topCenter"
            nz-tooltip>{{data['name']}}</td>
        <td nzAlign="center">{{data['typeName']}}</td>
        <td nzAlign="center">{{data['brandName']}}</td>
        <td nzAlign="center">{{USERTYPE[data['userType']]}}</td>
        <td nzAlign="center">{{COMMODITYSTATUS[data['status']]}}</td>
        <td nzAlign="center">
          <a (click)="addCommodity(data,0)" *ngIf="data['isSave']===0">添加</a>
          <a style="color: #666666" *ngIf="data['isSave']===1">已添加</a>
        </td>
      </tr>
      </tbody>
    </nz-table>
    <!-- 分页template -->
    <ng-template #totalTemplate let-total>共有 {{ addCommonCommodityModal.listData.total }} 条</ng-template>
  </div>
</nz-modal>


<!--添加二手商品-->
<nz-modal
  [(nzVisible)]="addUsedCommodityModal.visible"
  nzTitle="添加二手商品" nzWidth="1200px"
  [nzFooter]="null"
  (nzOnCancel)="hideAddUsedCommodityModal()">
  <div *nzModalContent>
    <div>
      <div class="searchItem">
        <label>编码：</label>
        <input nz-input placeholder="请输入机器编码" [(ngModel)]="addUsedCommodityModal.query.equipmentCode"/>
      </div>
      <div class="searchItem">
        <label>设备品牌：</label>
        <nz-select id="brandQuery" [(ngModel)]="addUsedCommodityModal.query.typeIds" nzPlaceHolder="全部" nzMode="multiple" [nzBackdrop]="true"
                   (ngModelChange)="getTypeList()" [nzMaxTagCount]="1" nzAllowClear
                   nzShowSearch>
          <nz-option [nzValue]="brand.id" [nzLabel]="brand.name" *ngFor="let brand of addUsedCommodityModal.typeOptions"></nz-option>
        </nz-select>
      </div>
      <div class="searchItem">
        <label>设备型号：</label>
        <nz-select id="typeQuery" [(ngModel)]="addUsedCommodityModal.query.modelIds" nzPlaceHolder="全部" nzMode="multiple" [nzBackdrop]="true"
                   [nzMaxTagCount]="1" nzAllowClear
                   nzShowSearch>
          <nz-option [nzValue]="type.id" [nzLabel]="type.name" *ngFor="let type of addUsedCommodityModal.modelOptions"></nz-option>
        </nz-select>
      </div>
      <div class="searchItem">
        <button nz-button nzType="primary" (click)="getCommodityUsedList(true)">查询</button>
        <button nz-button nzType="default" (click)="resetUsedCommodityCondition()">重置</button>
      </div>
    </div>
    <!--表格-->
    <nz-table
      #rowSelectionTable
      nzSize="small"
      nzTableLayout="fixed"
      nzShowSizeChanger
      nzShowQuickJumper
      nzOuterBordered
      [nzData]="addUsedCommodityModal.listData.records"
      [nzPageSizeOptions]="[5, 10, 20, 50, 100]"
      [nzTotal]="addUsedCommodityModal.listData.total"
      [(nzPageIndex)]="addUsedCommodityModal.query.page"
      [(nzPageSize)]="addUsedCommodityModal.query.pageSize"
      [nzFrontPagination]="false"
      [nzFooter]="null"
      [nzShowTotal]="totalTemplate"
      (nzPageIndexChange)="onUsedPageIndexChange($event)"
      (nzPageSizeChange)="onUsedPageSizeChange($event)"
    >
      <thead>
      <tr>
        <th nzAlign="center">机器编码</th>
        <th nzAlign="center">商品状态</th>
        <th nzAlign="center">品牌</th>
        <th nzAlign="center">型号</th>
        <th nzAlign="center">适用用户</th>
        <th nzAlign="center">C端售价</th>
        <th nzAlign="center">C端成色</th>
        <th nzAlign="center">内存</th>
        <th nzAlign="center">版本</th>
        <th nzAlign="center" nzWidth="160px">成交入库时间</th>
        <th nzAlign="center" nzWidth="160px">操作</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let data of rowSelectionTable.data;let index=index;">
        <td nzAlign="center">{{data['equipmentCode']}}</td>
        <td nzAlign="center">{{USEDSTATUS[data['status']]}}</td>
        <td nzAlign="center">{{data['typeName']}}</td>
        <td nzAlign="center">{{data['modelName']}}</td>
        <td nzAlign="center">{{USERTYPE[data['userType']]}}</td>
        <td nzAlign="center">{{data['shopPriceC']}}</td>
        <td nzAlign="center">{{data['colourName']}}</td>
        <td nzAlign="center">{{data['memory']}}</td>
        <td nzAlign="center">{{data['version']}}</td>
        <td nzAlign="center">{{data['clinchTime']}}</td>
        <td nzAlign="center">
          <a (click)="addCommodity(data,1)" *ngIf="data['isSave']===0">添加</a>
          <a style="color: #666666" *ngIf="data['isSave']===1">已添加</a>
        </td>
      </tr>
      </tbody>
    </nz-table>
    <!-- 分页template -->
    <ng-template #totalTemplate let-total>共有 {{ addUsedCommodityModal.listData.total }} 条</ng-template>
  </div>
</nz-modal>

<!--推荐商品-->
<nz-modal
  [(nzVisible)]="recommendModal.visible"
  nzWidth="400px"
  nzTitle="推荐"
  (nzOnCancel)="hideRecommendModal()">
  <div *nzModalContent>
    <div class="rowItem">
      <label>商品名称：</label>
      {{recommendModal.name}}
    </div>
    <div class="rowItem">
      <label for="addCategoryModalImage"><span>*</span>主图：</label>
      <app-image-upload id="addCategoryModalImage" style="width: 250px;display: inline-block"
                        [maxImgLength]="1"
                        [imageUrl]="recommendModal.img"
                        (deleteImg)="recommendModal.img=''"
                        (urlChange)="recommendModal.img=$event"></app-image-upload>
    </div>
  </div>
  <div *nzModalFooter>
    <button nz-button nzType="default" (click)="hideRecommendModal()">取消</button>
    <button nz-button nzType="primary" (click)="saveRecommend()">确认</button>
  </div>
</nz-modal>
